<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>教师个人信息</title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" href="css/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/user-info.css"/>
    <script src="js/jquery-3.1.1.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="/js/underscore-noflect.js"></script>
</head>

<body class="user-info">
<% include headerTeacher.ejs %>
<div class="container">
    <div class="message-area">
        <ol class="breadcrumb">
            <li>
                <a href="#">当前位置：</a>
            </li>
            <li>
                <a href="/teacherIndex">主页</a>
            </li>
            <li className="active">
                <a href="#">教师个人信息</a>
            </li>
        </ol>
    </div>
    <div class="message-detail-area">
        <ul class="nav nav-tabs">
            <li role="presentation" class="active">
                <a href="#tab1" data-toggle="tab">档案登记
                </a>
            </li>
        </ul>
        <div class="tab-content">
            <div class="tab-pane row-fluid active" id="tab1">
                <div class="list-group">
                    <form class="form-horizontal" id="userinfotable">
                        <div class="form-group col-sm-6">
                            <label for="input" class="col-sm-2 control-label">账户名</label>
                            <div class="col-sm-10">
                                <input id="dengluming" type="text" class="form-control" disabled placeholder=""
                                       value="<%= username %>">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="confirmBtn">
                    <button id="updataBtn1" class="btn btn-primary modify-btn" type="submit">修改资料</button>
                </div>
            </div>
        </div>
    </div>
    <hr class="divider task-divider"/>
    <div class="summary">
        <footer>
            <p class="pull-right">
                <a href="#top">回到顶部</a>
            </p>
            <p class="pull-left">&copy; 学生档案管理系统</p>
        </footer>
    </div>
</div>
<script type="text/template" id="moban">
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">教师姓名</label>
        <div class="col-sm-10">
            <input id="teacherName" type="text" class="form-control" value="{{=teacherName}}" placeholder="请输入您的真实姓名">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">教师编号</label>
        <div class="col-sm-10">
            <input id="teacherNum" type="text" class="form-control" value="{{=teacherNum}}" placeholder="请输入您的教师编号">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">性别</label>
        <div class="col-sm-10">
            <select class="form-control" id="sex">
                <option value="男">男</option>
                <option value="女">女</option>
            </select>
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">年龄</label>
        <div class="col-sm-10">
            <input id="teacherAge" type="text" class="form-control" value="{{=teacherAge}}" placeholder="请输入您的年龄">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">身份证号</label>
        <div class="col-sm-10">
            <input id="IDnumber" type="text" class="form-control" value="{{=IDnumber}}" placeholder="请输入您的身份证号">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">教师职称</label>
        <div class="col-sm-10">
            <input id="teacherTitle" type="text" class="form-control" value="{{=teacherTitle}}" placeholder="请输入您的职称">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="inputPassword3" class="col-sm-2 control-label">所属专业</label>
        <div class="col-sm-10">
            <select class="form-control" id="major">
                <option value="信息工程">信息工程</option>
                <option value="软件工程">软件工程</option>
                <option value="计算机科学与技术">计算机科学与技术</option>
            </select>
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="input" class="col-sm-2 control-label">联系电话</label>
        <div class="col-sm-10">
            <input id="telNum" type="text" class="form-control" value="{{=telNum}}" placeholder="请输入您的联系电话">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="inputPassword3" class="col-sm-2 control-label">所属院系</label>
        <div class="col-sm-10">
            <select class="form-control" id="department" value="{{=department}}">
                <option value="信息技术与工程学院">信息技术与工程学院</option>
                <option value="外国语学院">外国语学院</option>
                <option value="电子商务管理学院">电子商务管理学院</option>
            </select>
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="inputPassword3" class="col-sm-2 control-label">民族</label>
        <div class="col-sm-10">
            <input id="national" type="text" class="form-control" value="{{=national}}" placeholder="请输入您在民族">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="inputPassword3" class="col-sm-2 control-label">籍贯</label>
        <div class="col-sm-10">
            <input id="nativePlace" type="text" class="form-control" value="{{=nativePlace}}" placeholder="请输入您的籍贯">
        </div>
    </div>
    <div class="form-group col-sm-6">
        <label for="inputPassword3" class="col-sm-2 control-label">现居住地址</label>
        <div class="col-sm-10">
            <input id="address" type="text" class="form-control" value="{{=address}}" placeholder="请输入您现居住地址">
        </div>
    </div>
</script>
<script type="text/javascript">
    //得到模板
    var $userinfotable = $("#userinfotable");
    //得到模板函数
    var compiled = _.template($("#moban").html());
    var dengluming = $("#dengluming").val();

    console.log(dengluming);
    $.ajax({
        "url": "/showTeacherInfo?dengluming=" + dengluming,
        "type": "get",
        "success": function (result) {
            console.log(result[0]);
            let plos = result[0].major;
            let depa = result[0].department;
            let sexInfo = result[0].sex;
            let htmlstring = compiled(result[0]);
            //添加DOM
            $("#userinfotable").append($(htmlstring));
            $("#sex option[value='" + sexInfo + "']").attr("selected", true);
            $("#major option[value='" + plos + "']").attr("selected", true);
            $("#department option[value='" + depa + "']").attr("selected", true);
        }
    });
    //用ajax提交表单
    $("#updataBtn1").click(function () {
        var major = $("#major option:selected").text();
        var department = $("#department option:selected").text();
        $.get("/updataTeacher", {
            "dengluming": $("#dengluming").val(),
            "teacherName": $("#teacherName").val(),
            "teacherNum": $("#teacherNum").val(),
            "major": major,
            "telNum": $("#telNum").val(),
            "sex": $("#sex").val(),
            "department": department,
            "teacherAge": $("#teacherAge").val(),
            "national": $("#national").val(),
            "nativePlace": $("#nativePlace").val(),
            "address": $("#address").val(),
            "IDnumber": $("#IDnumber").val(),
            "teacherTitle":$("#teacherTitle").val()
        }, function (result) {
            if (result == "1") {
                alert("修改成功！，将自动跳转到首页");
                window.location = "/teacherIndex";
            } else {
                alert("修改失败！，将自动跳转到首页");
                window.location = "/teacherIndex";
            }
        })
    });

</script>
</body>

</html>